<template>
    <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="Number(currentPage)"
        :page-sizes="[10, 25, 50]"
        :page-size="Number(pageSize)"
        layout="total, sizes, prev, pager, next, jumper"
        :total="Number(totalElements)"
    ></el-pagination>
</template>

<script>
import { Pagination } from 'element-ui';

export default {
    props: [
        'currentPage',
        'handleCurrentChange',
        'totalElements',
        'handlePageSizeChange',
        'pageSize',
    ],
    components: {
        ElPagination: Pagination,
    },
    data() {
        return {};
    },
    methods: {
        handleSizeChange(val) {
            if (this.handlePageSizeChange) {
                this.handlePageSizeChange(val, 'size');
            }
        },
    },
    mounted() { },
};
</script>

<style lang="scss">
.el-pagination {
    padding: 0;
    text-align: right;
}
</style>
